import React from 'react';
import './index.scss';
import emitter from '../emitter';
import { getGuid } from '@/utils';

export default class extends React.Component {
    constructor(props) {
        super(props);
    }

    onGridClick = (type) => {
        emitter.emit('new:node', {
            id: getGuid(),
            type
        });
    }

    render() {
        return (
          <div className="tool-grid">
              <div className="tool-grid-row">
                  <div className="tool-grid-col" onClick={() => this.onGridClick('rectangle')}>
                      长方形
                  </div>
                  <div className="tool-grid-col" onClick={() => this.onGridClick('circle')}>
                      圆形
                  </div>
                  <div className="tool-grid-col">
                      图片
                  </div>
              </div>
              <div className="tool-grid-row">
                  <div className="tool-grid-col" onClick={() => this.onGridClick('text')}>
                      文本
                  </div>
                  <div className="tool-grid-col">
                      多边形
                  </div>
                  <div className="tool-grid-col">
                      圆环
                  </div>
              </div>
              <div className="tool-grid-row">
                  <div className="tool-grid-col">
                      扇形
                  </div>
                  <div className="tool-grid-col">
                      路径
                  </div>
                  <div className="tool-grid-col">
                      曲线
                  </div>
              </div>
          </div>
        );
    }
}
